<template>
	<div>
		<div class="book-info">
			<div><img src="/static/img/book1.jpg"></div>
			<div>
				<p>{{info.title}}</p>
				<p>{{info.author}}</p>
				<p>{{info.lastDate}}更新</p>
				<p>{{info.read}}人阅读</p>
				<p><span class="read" v-link="{'name': 'book', parmas: {bookid: bookid}}">阅读</span></p>
			</div>
		</div>
		<div>
			<legend>简介</legend>
			<p>{{info.introduction}}</p>
		</div>
	</div>
</template>
<script>
	export default {
		props: ['info', 'bookid']
	}
</script>
<style scoped>
	.book-info {
		display: flex;
		padding-bottom: 20px;
	}
	.book-info img{
		width: 108px;
	}
	.book-info>div:nth-child(2){
		flex: 1;
		padding-left: 20px;
	}
	.read {
		background-color: #20a0ff;
		color: #FFF;
		display: inline-block;
		padding: 3px 15px;
		font-size: 1.3rem;
	}
</style>